<!--
* description: 采购管理-欠拨结案特殊备件定义
* author:xlw
* createdDate: 2021-2-24
-->
<template>
  <div class="app-container app-container-table">
    <one-table-template
      ref="multipleTable"
      :dynamic-buttons="tableButtons"
      :dynamic-components="tableComponents"
      :dynamic-api-config="dynamicApiConfigs"
      :dynamic-table-cols="tableCols"
      :dynamic-form-fields="formField"
      :callback-obj="callbackObj"
      :dynamic-is-show-select="true"
      :dynamic-is-init-table="true"
      :dynamic-is-fix-choose="false"
      :dynamic-is-fix-index="false"
      :dynamic-api-style="'restful'"
    >
      <template #caseClosedDays="scope">
        <el-input-number
          :key="'num'"
          v-model="scope.row['caseClosedDays']"
          :step="1"
          :min="1"
          step-strictly
          :controls="false"
          :size="small"
        />
      </template>
    </one-table-template>
  </div>
</template>

<script>
import { formMixins } from '@/components/mixins/formMixins'
import { oneTableWithViewTemplateMixins } from '@/components/mixins/oneTableWithViewTemplateMixins'
import OneTableTemplate from '@/components/templates/oneTable'
import { orgApis } from '@/api/paSparePartsManagement'
import { exportExcel } from '@/utils/getTimeString.js'

export default {
  name: 'SpecialSparePartsDelimiting',
  components: {
    OneTableTemplate
  },
  mixins: [oneTableWithViewTemplateMixins, formMixins],
  data() {
    return {
      selectiondata: [],
      dynamicApiConfigs: orgApis.queryUnderdialSpecialPartInfo,
      // 动态生成网格列
      tableCols:
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path] &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols
          .length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[this.$route.path].tableCols
          : [
            {
              prop: 'partNo',
              label: '备件编码',
              align: 'center'
            },
            {
              prop: 'partName',
              label: '备件名称',
              align: 'center'
            },
            {
              prop: 'partRepairTypeCn',
              label: '维修类型',
              align: 'center'
            },
            {
              prop: 'carConfigIdList',
              label: '适用车型',
              align: 'center'
            },
            {
              prop: 'caseClosedDays',
              label: '结案天数',
              align: 'center',
              // isShowLabel: false,
              // isComponent: true,
              isSlot: true
              // comps: [
              //   {
              //     compKey: 'audit',
              //     codeField: 'caseClosedDays',
              //     component: () => import('@/components/org/commonInput'),
              //     type: 'inputText',
              //     align: 'center',
              //     isSlot: true,
              //     change:(val,comType,row)=>this.changeRow(val, comType, row),
              //   }
              // ]
            },
            {
              prop: 'remark',
              label: '备注',
              align: 'center',
              isShowLabel: false,
              isComponent: true,
              comps: [
                {
                  compKey: 'audwj',
                  codeField: 'remark',
                  component: () => import('@/components/org/commonInput')
                }
              ]
            }
          ],
      tableComponents:
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path] &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
          .tableComponents &&
        this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
          .tableComponents.length > 0
          ? this.$ConfigCache.CacheConfig.cacheData[this.$route.path]
            .tableComponents
          : [
            {
              compKey: 'compKey1',
              labelName: '备件编码：',
              codeField: 'partNo',
              textField: 'partName',
              component: () => import('@/views/ve/planReport/components/multipleSearchInput'),
              isMust: true,
              customObj: {showType: ''},
              dataToObject: {
                oFields: 'partNo,partName',
                // 控制弹窗页面 搜索 网格 元素
                tableComponents: [
                  {
                    compKey: 'compKey2',
                    labelName: '备件编码：',
                    codeField: 'partNo',
                    component: () => import('@/components/org/commonInput'),
                    type: 'inputText',
                    isMust: true,
                    span: 8
                  },
                  {
                    compKey: 'compKey3',
                    labelName: '备件名称：',
                    codeField: 'partName',
                    component: () => import('@/components/org/commonInput'),
                    type: 'inputText',
                    isMust: true,
                    span: 6
                  }
                ],
                tableCols: [
                  {
                    prop: 'partNo',
                    label: '备件编码'
                  },
                  {
                    prop: 'partName',
                    label: '备件名称'
                  }
                ],
                formField: {
                  partNo: '',
                  partName: ''
                },
                returnField: {
                  prop: 'partNo',
                  label: '备件编码'
                },
                api: {
                  APIUrl: '/mp/e3sh/spareparts/sparePartsOrderMakingService/queryPartChoose.do'
                }
              },
              span: 6
            },
            // 车辆状态
            {
              compKey: 'compKey4',
              labelName: '备件名称：',
              codeField: 'partName',
              lookuptype: 'VE0207',
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              isMust: true,
              span: 6
            },

            // 审核状态
            {
              compKey: 'compKey5',
              labelName: '结案天数：',
              codeField: 'caseClosedDays',
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              isMust: true,
              span: 6
            },
            {
              compKey: 'compKey6',
              labelName: '备注：',
              codeField: 'remark',
              lookuptype: 'VE0212',
              component: () => import('@/components/org/commonInput'),
              type: 'inputText',
              isMust: true,
              span: 6
            }
          ],
      tableButtons: [
        {
          conmpKey: 'btenKey1',
          type: 'primary',
          size: 'small',
          text: '查询',
          name: 'search',
          clickEvent: () => this.queryTable(1),
          position: 'right'
        },
        {
          conmpKey: 'btenKey2',
          type: '',
          size: 'small',
          text: '重置',
          name: 'reset',
          clickEvent: () => this.reset(),
          position: 'right'
        },
        {
          compKey: 'btnKey3',
          type: '',
          size: 'small',
          parentFileds: 'disabled:table',
          clickEvent: () => this.distributor(),
          text: '保存',
          name: 'batchSubmit',
          position: 'left'
        },
        {
          compKey: 'btnKey4',
          type: '',
          size: 'small',
          clickEvent: () => this.export(),
          text: '导出',
          name: 'export',
          position: 'left'
        },
        {
          compKey: 'btnKey5',
          type: '',
          size: 'small',
          name: 'importTemplate',
          position: 'upload',
          clickEvent: () => this.handleChange(),
          text: '导入'
        },
        {
          compKey: 'btnKey6',
          type: 'text',
          size: 'small',
          name: '',
          position: 'upload',
          click: (event) => { this.templateDownload() }
        }
      ],
      formField:  {
        partNo: '',
        partName: '',
        caseClosedDays: '',
        remark: ''
      },
      callbackObj: {
        // 手动勾选网格时，拿到勾选网格的数据
        onCheckSelect: (selection, row) => {
          this.selectiondata = selection
        }
      }
    }
  },
  mounted() {
    this.queryTable(1)
  },
  methods: {
    // changeRow(val, comType, row){
    //   let standard = /^[1-9]+[0-9]*$/
    //   const num=standard.test(val)
    //   if(!num){
    //     row.caseClosedDays=""
    //     return this.$message('请输入正整数！')
    //   }
    //   console.log("!23:",row.caseClosedDays)
    // },
    templateDownload() {
      const fileName = this.$utils.fileNameWithTime('欠拨结案特殊备件设置模板.xlsx')
      this.$requestAPI({
        apiUrl: orgApis.downloadTemplate.APIUrl,
        variables: { dataType: 'excel' }
      }).then(res => {
        this.$utils.downloadFile(res, fileName)
      }).catch(err => {
        console.log(err)
      })
    },

    handFileListChange(file, fileList) {
      if (this.beforeAvatarUpload(file)) {
        this.handleChanged(file)
      }
    },
    beforeAvatarUpload(file) {
      if (file.size > 50 * 1024 * 1024) {
        this.$message({
          message: '文件大小不能超过50M',
          type: 'warning'
        })
        return false
      }
      const fileType = file.name.substr(file.name.lastIndexOf('.') + 1)
      if (fileType != 'xls' && fileType != 'xlsx') {
        this.$message({
          message: '只能导入后缀为xls,xlsx的文件！',
          type: 'warning'
        })
        return false
      }
      return true
    },
    handleChanged(param) {
      const loading = this.$loading({
        lock: true,
        text: '导入中...',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      const that = this
      const url = orgApis.importExcel.APIUrl
      that
        .$requestUpload(url, param)
        .then(response => {
          loading.close()
          if (response.result === '1') {
            this.$message({
              message: '导入成功',
              type: 'success'
            })
            that.queryTable()
          } else {
            this.$message({
              message: response.msg,
              type: 'warning'
            })
          }
        })
        .catch(err => {
        })
    },
    export() {
      exportExcel(this.formField, orgApis.exportDetailsUnderdial.APIUrl, orgApis.exportDetailsUnderdial.ServiceCode, '欠拨结案特殊备件定义')
    },
    distributor() {
      const that = this
      const infoQue = []
      this.selectiondata.forEach(function(val, index) {
        infoQue.push({
          caseClosedDays: val.caseClosedDays,
          underdialSetId: val.underdialSetId,
          remark: val.remark
        })
      })
      if (infoQue.length == 0) {
        this.$message({
          message: '请勾选数据后进行提交',
          type: 'success',
          duration: 2000
        })
      } else {
        const queryObj = {
          apiConfig: orgApis.updateUnderdialSpecialPart,
          // 条件/实体参数（变量），根据typeParam中的定义配置
          variables: {
            // 当前中台使用的名称有dataInfo、info，具体查看API文档
            dataInfo: infoQue
          }
        }
        // 转换了中台请求格式数据
        var paramD = that.$getParams(queryObj)
        // 调用中台API方法（可复用）
        that.$requestAPI(paramD).then((response) => {
          if (response.result === '0') {
            that.$message({
              message: response.msg,
              type: 'success',
              duration: 2000
            })
          }
          var getResult = response
          if (getResult.result === '1') {
            that.$message({
              message: '保存成功',
              type: 'success',
              duration: 2000
            })
            // 重置表单
            // that.resetRight(tableRef)
            that.queryTable(1)
            this.infoQue = []
            // 重新加载
            // that.queryTable(1)
          } else {
            that.$message({
              message: getResult.msg,
              type: 'warning',
              duration: 2000
            })
          }
        })
        // }
      }
    }
  }
}
</script>

<style>
</style>
